import React, { Component } from 'react'
import style from './order.module.scss'
import { getOrderListUrl, imgUrl } from '@/api'
import HomeNoLogin from '@/components/HomeNoLogin'
import { connect } from 'react-redux'


class Order extends Component {
    constructor(props) {
        super(props)
        this.state = {
            orderList: []
        }
    }
    render() {
        return (
            <div className={style.orderBox}>
                {
                    this.props.islogin ? (this.state.orderList.map((item) => {
                        return (
                            <li key={item.id} className={style.orderLiBox}>
                                <img className={style.orderImg} src={imgUrl + item.restaurant_image_hash} alt="" />
                                <div className={style.orderRightBox}>
                                    <div className={style.titlebox} onClick={() => { window.location.href = item.rebuy_scheme }}>
                                        <div className={style.orderTitle}>
                                            <p className={style.restaurant_name}>{item.restaurant_name}</p>
                                            <p className={style.formatted_created_at}>{item.formatted_created_at}</p>
                                        </div>
                                        <p className={style.isService}>已送达</p>
                                    </div>
                                    <div className={style.orderItemNameBox} onClick={() => { window.location.href = item.order_scheme }}>
                                        <p className={style.orderItemName}>{item.basket.group[0][0].name}</p>
                                        <span className={style.orderItemPrice}>￥{item.total_amount}</span>
                                    </div>
                                    <div className={style.anotherOneBox}>
                                        <button className={style.anotherOne} onClick={() => { window.location.href = item.rebuy_scheme }}>再来一单</button>
                                    </div>
                                </div>
                            </li>
                        )
                    })) : <HomeNoLogin />
                }
            </div>
        )
    }
    componentDidMount() {
        getOrderListUrl().then((res) => {
            console.log(res);
            res.forEach(item => {
                // 开头
                let a = item.restaurant_image_hash.slice(0, 1) + '/'
                let b = item.restaurant_image_hash.slice(1, 3) + '/'
                // 结尾 图片格式
                let c;
                let d = item.restaurant_image_hash.slice(3)
                if (item.restaurant_image_hash.indexOf("png") !== -1) {
                    c = "." + item.restaurant_image_hash.slice(-3)
                } else {
                    c = "." + item.restaurant_image_hash.slice(-4)
                }
                let imgpath = a + b + d + c
                item.restaurant_image_hash = imgpath
            })
            this.setState({
                orderList: res
            })
        })
    }
}


const stateToProps = (state) => {
    return {
        currentLocation: state.region.currentLocation,
        LocationSelected: state.shipping.LocationSelected,
        islogin: state.user.isLogin
    }
}

const dispatchToProps = (dispatch) => {
    return {
    }
}


export default connect(stateToProps, dispatchToProps)(Order)
